<!--
 * @Author: mhb
 * @Date: 2021-12-21 17:38:02
 * @LastEditTime: 2021-12-28 10:12:33
 * @LastEditors: Please set LastEditors
 * @Description: 发起评审
 * @FilePath: \cscec-pms-admin-3\src\views\quality\resultsManagement\QCActivityResult\InitiateReview.vue
-->
<template>
  <div>
    <div class="mb20">
      <title-name title="添加活动成果"></title-name>
      <a-row type="flex" class="mb12">
        <!-- 选择QC成果报告信息 -->
        <ChooseQCActivityReport :form="form" />
        <a-button icon="delete" :disabled="!selectedRowKeys.length" class="ml12" @click="handleRemove(0)"
          >移除</a-button
        >
      </a-row>
      <a-table
        rowKey="id"
        :row-selection="{
          type: 'checkbox',
          selectedRowKeys: selectedRowKeys,
          onChange: (keys, rows) => {
            selectedRowKeys = keys
            selectedRows = rows
          }
        }"
        :dataSource="form.achievements"
        :pagination="false"
        :columns="columns"
      >
        <!-- 附件 -->
        <FileLink slot="files" slot-scope="text" :fileList="text" />
        <!-- 操作：移除 -->
        <a slot="actions" slot-scope="text, record" @click="handleRemove(0, record)">移除</a>
      </a-table>
    </div>
    <div>
      <title-name title="添加评审成员"></title-name>
      <div class="mb12">
        <a-button type="primary" icon="plus" @click="$refs['dialogEdit'] && $refs['dialogEdit'].open()"
          >添加人员</a-button
        >
        <a-button class="ml12" :disabled="!selectedRowKeys2.length" icon="delete" @click="handleRemove(1)"
          >移除</a-button
        >
      </div>
      <a-table
        rowKey="userId"
        :row-selection="{
          selectedRowKeys: selectedRowKeys2,
          onChange: (keys, rows) => {
            selectedRowKeys2 = keys
            selectedRows2 = rows
          }
        }"
        :dataSource="form.employees"
        :columns="columns2"
        :pagination="false"
      >
        <!-- 操作栏 -->
        <a slot="actions" slot-scope="text, record" @click="handleRemove(1, record)">移除</a>
      </a-table>
    </div>
    <SelectPerson
      :ref="'dialogEdit'"
      header-title="添加人员"
      :form="{ whether: false }"
      :selectData="form.employees || []"
      @confirm="handleAdd"
    />
  </div>
</template>

<script>
import ChooseQCActivityReport from '../components/ChooseQCActivityReport' // 选择QC成果报告信息
import ASelectOrgPeople from '@/components/Select/ASelectOrgPeople' // 项目人员
import SelectPerson from '@/components/BComponents/BSelectPerson' // 项目人员

export default {
  name: 'InitiateReview',
  components: {
    ChooseQCActivityReport,
    ASelectOrgPeople,
    SelectPerson
  },
  props: {
    // 表单
    form: {
      type: Object,
      default: () => {}
    },
    // 请求api
    api: {
      type: Object,
      default: () => null
    }
  },
  data() {
    return {
      selectedRows: [], // 成果信息选中集合
      selectedRowKeys: [], // 成果信息选中id集合
      selectedRows2: [], // 人员信息选中集合
      selectedRowKeys2: [], // 人员信息选中id集合
      columns: [
        {
          dataIndex: 'projectName',
          title: '项目名称'
        },
        {
          dataIndex: 'register.topicName',
          title: '课题名称'
        },
        {
          dataIndex: 'register.topicTypeName',
          title: '课题类型'
        },
        {
          dataIndex: 'register.topicRegisterNumber',
          title: '课题注册号'
        },
        {
          dataIndex: 'completeEmployeeName',
          title: '课题实际完成人'
        },
        {
          dataIndex: 'files',
          title: '附件',
          scopedSlots: { customRender: 'files' }
        },
        {
          dataIndex: 'actions',
          title: '操作',
          width: 80,
          scopedSlots: { customRender: 'actions' }
        }
      ], // 成果表头
      columns2: [
        {
          title: '姓名',
          ellipsis: true,
          dataIndex: 'name'
        },
        {
          title: '职称',
          ellipsis: true,
          dataIndex: 'jobTitle',
          customRender(e) {
            return e || '无'
          }
        },
        {
          title: '岗位',
          dataIndex: 'postPNames',
          ellipsis:true,
          customRender(e) {
            return e || '无'
          }
        },
        {
          title: '学历',
          ellipsis: true,
          dataIndex: 'specialitieMax',
          customRender(e) {
            return e || '无'
          }
        },
        {
          dataIndex: 'actions',
          width: 80,
          title: '操作',
          scopedSlots: { customRender: 'actions' }
        }
      ] // 人员表头
    }
  },
  methods: {
    /**
     * 添加人员
     * @param {Array}} e -选中人员
     */
    handleAdd(e) {
      let employees = e.map((i) => ({
        userId: i.userId,
        name: i.name,
        jobTitle: i.jobTitle,
        postPNames: i.postPNames?.join('，'),
        specialitieMax: i.specialitieMax
      }))
      this.$set(this.form, 'employees', employees)
    },
    /**
     * 移除
     * type:移除类型：0 活动成果；1 评审人员
     * obj:当前行业务对象
     */
    handleRemove(type, obj) {
      let name = ['achievements', 'employees'][type] // 移除类型
      let id = ['id', 'userId'][type] // 主键
      let rows = obj ? [obj] : this[type ? 'selectedRows2' : 'selectedRows'] // 需要移除的数组对象
      let keys = rows?.map((i) => i[id]) // 需要移除的数组对象
      this.$confirm({
        title: '温馨提示',
        content: `确定删除${rows?.map((i) => (type ? i.name : i.register?.topicName)).join('，')}？`,
        onOk: () => {
          this.form[name] = this.form[name].filter((i) => !keys.includes(i[id]))
          !type && (this.form.achievementIds = this.form.achievementIds.filter((i) => !keys.includes(i)))
          this[type ? 'selectedRows2' : 'selectedRows'] = []
          this[type ? 'selectedRowKeys2' : 'selectedRowKeys'] = []
        }
      })
    },
    /**
     * 提交表单
     */
    handleSubmit() {
      let that = this
      // 校验项目信息

      // 校验人员
      if (!that.form.achievementIds?.length) {
        that.$message.warning('活动成果列表不能为空！')
        return
      }
      // 校验人员
      if (!that.form.employees?.length) {
        that.$message.warning('评审人员列表不能为空！')
        return
      }
      that.$confirm({
        title: '温馨提示',
        content: '确定提交，提交后不可撤回？',
        onOk: () => {
          // 提交表单
          let form = that.$clone(that.form)
          form.reviewUnit = that.$currentPost()?.id
          form.reviewUnitName = that.$currentPost()?.name
          // 删除冗余表单
          delete form.achievements
          return this.api.handleCreate(form).then((res) => {
            if (res.code === 200 || res.data.code === 200) {
              that.$message.success('提交成功！')
              that.$multiTab.close()
            }
          })
        }
      })
    }
  }
}
</script>
